
// uno.config.ts
// 导入 UnoCSS 的 defineConfig 函数，用于定义 UnoCSS 的配置
import { defineConfig } from 'unocss'

/**
 * UnoCSS 配置
 * 此配置文件用于定义 UnoCSS 的自定义快捷类。
 * 快捷类允许您通过单个类名来组合多个 UnoCSS 实用类。
 */
export default defineConfig({
  // theme
  theme: {
    colors: {
      "primary": "var(--el-color-primary)",
      "text-color-primary": "var(--el-text-color-primary)",
      "text-color-regular": "var(--el-text-color-regular)",
      "text-color-secondary": "var(--el-text-color-secondary)",
      "text-color-placeholder": "var(--el-text-color-placeholder)",
    },
  },
  // 自定义快捷类
  shortcuts: {
    // 定义一个快捷类 "wh-full"，它组合了 "w-full" 和 "h-full"，表示宽度和高度都为 100%
    "wh-full": "w-full h-full",
    // 定义一个快捷类 "flex-center"，它组合了 "flex"、"justify-center" 和 "items-center"，用于创建一个水平和垂直居中的 Flex 容器
    "flex-center": "flex justify-center items-center",
    // 定义一个快捷类 "flex-x-center"，它组合了 "flex" 和 "justify-center"，用于创建一个水平居中的 Flex 容器
    "flex-x-center": "flex justify-center",
    // 定义一个快捷类 "flex-y-center"，它组合了 "flex" 和 "items-center"，用于创建一个垂直居中的 Flex 容器
    "flex-y-center": "flex items-center",
    // 定义一个快捷类 "flex-x-start"，它组合了 "flex"、"items-center" 和 "justify-start"，用于创建一个水平居左且垂直居中的 Flex 容器
    "flex-x-start": "flex items-center justify-start",
    // 定义一个快捷类 "flex-x-between"，它组合了 "flex"、"items-center" 和 "justify-between"，用于创建一个水平两端对齐且垂直居中的 Flex 容器
    "flex-x-between": "flex items-center justify-between",
    // 定义一个快捷类 "flex-x-end"，它组合了 "flex"、"items-center" 和 "justify-end"，用于创建一个水平居右且垂直居中的 Flex 容器
    "flex-x-end": "flex items-center justify-end",
  },
})
